import { DirectiveBinding } from 'vue'
import { useStore } from '@/stores/userInfo'

// 检查用户是否有指定权限
function checkPermission(value: string | string[]): boolean {
  if (!value) {
    return false
  }
  
  const store = useStore()
  const { role, permissions } = store.userinfo
  
  // 如果没有权限数据，则不显示
  if (!permissions || permissions.length === 0) {
    return false
  }
  
  // 如果是管理员角色(ID为1或2)，直接放行
  if (role === 1 || role === 2) {
    return true
  }
  
  // 判断是否有指定权限
  if (typeof value === 'string') {
    return permissions.includes(value)
  }
  
  // 如果传入的是数组，只要有一个权限符合即可
  if (Array.isArray(value)) {
    return value.some(permission => permissions.includes(permission))
  }
  
  return false
}

// 权限指令
export default {
  mounted(el: HTMLElement, binding: DirectiveBinding) {
    const { value } = binding
    const hasPermission = checkPermission(value)
    
    if (!hasPermission) {
      // 如果没有权限，则从DOM中移除元素
      el.parentNode?.removeChild(el)
    }
  }
} 